<!DOCTYPE html>
<html>
<head>
   <meta charset="utf-8">
   <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
   <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
   <title>Release Party</title> 
   <link rel="stylesheet" href="http://code.jquery.com/mobile/1.0rc1/jquery.mobile-1.0rc1.min.css" />
   <script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
   <script src="http://code.jquery.com/mobile/1.0rc1/jquery.mobile-1.0rc1.min.js"></script>

   <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false&language=th"></script>
   <script type="text/javascript">
      function initialize() {
         var myLatlng = new google.maps.LatLng(13.744255335704356,100.53158033995055);
         var myOptions = {
          zoom: 17,
          center: myLatlng,
          mapTypeId: google.maps.MapTypeId.ROADMAP
         }
         var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
         var marker = new google.maps.Marker({
               position: myLatlng, 
               map: map, 
         });   
      }

      function loadScript() {
         var script = document.createElement("script");
         script.type = "text/javascript";
         script.src = "http://maps.googleapis.com/maps/api/js?sensor=false&callback=initialize";
         document.body.appendChild(script);
      }

      window.onload = loadScript;
      
   </script>

      
</head>
<body >
<div data-role="page" data-theme="b" style="width:100%; height:100%;">
   <div data-role="header">
      <h1>แผนที่</h1>
      <a data-rel="back" data-role="button" data-icon="back">กลับ</a>
   </div>
    
    <div data-role="content" style="padding:0;">
        <div id="map_canvas" style="width:100%; height:600px;"></div>
    </div>
   <div data-role="footer" data-theme="a" data-position="fixed">
		<h4>&copy; ubuntuclub.com</h4>
	</div><!-- /footer -->
</div>

</div><!-- /page map -->
   
</body>
</html>
